<template>
  <div>
    <div class="searchBox">
         <div class="label">时间：</div>
         <a-range-picker style="height:32px;" v-model:value="rangeTime" @change="rangeTimeChange" valueFormat="YYYY-MM-DD" />
         <a-button type="primary" style="margin-left:15px;" @click="handleSearch" preIcon="ant-design:search-outlined"> 查询</a-button>
         <a-button  style="margin-left:15px;" @click="handleRest" preIcon="ic:baseline-restart-alt"> 重置</a-button>
    </div>
    <div class="tableBox">
        <BasicTable
        ref="tableRef"
        :columns="listColumns"
        :dataSource="dataSource"
        :border="true"
      >
        <template #tableTitle>
          <a-button  type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
        </template>
      </BasicTable>
    </div>
  </div>
</template>

<script lang="ts" name="dormitory-DormTotalScoreStatic" setup>
  import {ref, reactive, computed, unref,onMounted} from 'vue';
  import {BasicTable, useTable, TableAction} from '/@/components/Table';
  import {useModal} from '/@/components/Modal';
  import { useListPage } from '/@/hooks/system/useListPage'
  import {columns, searchFormSchema} from './DormTotalScoreStatic.data';
  import {list,getExportUrl,totalScoreList} from './DormTotalScoreStatic.api';
  import { downloadFile } from '/@/utils/common/renderUtils';
  import { useUserStore } from '/@/store/modules/user';
  const queryParam = reactive<any>({});
  const checkedKeys = ref<Array<string | number>>([]);
  const userStore = useUserStore();

  const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
    tableProps:{},
    exportConfig: {
            name:"宿舍总分统计",
            url: getExportUrl,
            params: queryParam,
    },
  })

  const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext

  //注册model
  const listColumns =  ref([
    {
      title: '部门',
      dataIndex: 'departName',
    },
    {
      title: '房间号',
      dataIndex: 'roomCode',
    },
    {
      title: '总分',
      dataIndex: 'totalScore',
    },
  ])
  let dataSource = ref([])
  let rangeTime = ref([])

  function handleSearch(){
    getList()
  }
  function handleRest(){
    rangeTime.value = []
    sdate.value = getMonthFirst()
    edate.value = getDay()
    getList()
  }
  let sdate = ref('')
  let edate = ref('')
  rangeTime.value.push()
  sdate.value = getMonthFirst()
  edate.value = getDay()
  rangeTime.value = [(sdate.value)  ,(edate.value)]
  function getList(){
    let data = {
      sdate : sdate.value,
      edate : edate.value,
    }
    queryParam.sdate = sdate.value
    queryParam.edate = edate.value
    totalScoreList(data).then(res=>{
      console.log(res);
      listColumns.value = listColumns.value.slice(0,2)
      if(res.length){
          let tempObj = res[0]
          let keys =  Object.keys(tempObj) 
          let dateKeys = []
          keys.forEach(item=>{
            if(isDate(item)){
              dateKeys.push(item)
            }
          })
          dateKeys.sort((a, b) => {
            return Date.parse(a) - Date.parse(b);
          });
          dateKeys.forEach(item=>{
             let obj =  {
                title: item,
                dataIndex: item,
              }
              listColumns.value.splice(listColumns.value.length,0,obj)
          })
          // console.log(listColumns.value);
        }
        dataSource.value = res
    })
  }
  function rangeTimeChange(e){
    console.log(e);
    sdate.value = e[0]
    edate.value = e[1]
    console.log(sdate.value);
    console.log(edate.value);
    //  let data = {
    //   sdate : sdate.value,
    //   edate : edate.value,
    // }
    queryParam.sdate = sdate.value
    queryParam.edate = edate.value

  }
function getMonthFirst() {
      function doHandleMonth(month) {
          var m = month;
          if (month.toString().length == 1) {
              m = "0" + month;
          }
          return m;
      }
      var today = new Date();
      // var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;
      // today.setTime(targetday_milliseconds); //注意，这行是关键代码
      var tYear = today.getFullYear();
      var tMonth = today.getMonth();
      var tDate = today.getDate();
      tMonth = doHandleMonth(tMonth + 1);
      tDate = doHandleMonth(tDate);
      return tYear + "-" + tMonth + "-" + '01';
}
 function getDay() {
      function doHandleMonth(month) {
          var m = month;
          if (month.toString().length == 1) {
              m = "0" + month;
          }
          return m;
      }
      var today = new Date();
      // var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;
      // today.setTime(targetday_milliseconds); //注意，这行是关键代码
      var tYear = today.getFullYear();
      var tMonth = today.getMonth();
      var tDate = today.getDate();
      tMonth = doHandleMonth(tMonth + 1);
      tDate = doHandleMonth(tDate);
      return tYear + "-" + tMonth + "-" + tDate;
}
function isDate(value) {
   return !isNaN(Date.parse(value));
}
   /**
    * 成功回调
    */
  function handleSuccess() {
      (selectedRowKeys.value = []) && reload();
   }
   onMounted(()=>{
    console.log(111122);
    console.log(getMonthFirst());
    console.log(getDay());
    getList()
   })
  


</script>

<style lang="less" scoped>
.searchBox{
  display: flex;
  align-items: center;
  background: #fff;
  margin: 10px;
  padding: 6px;
  height: 60px;
  .label{
    display: inline-flex;
    justify-content: flex-end;
    align-items: center;
    width: 130px;
    height: 32px;
    color: rgba(0, 0, 0, 0.88);
  }
 
}
.tableBox{
  background: #fff;
  padding: 6px;
  margin: 10px;
}

</style>